<script>
    
$(document).ready(function() {
	 
    $('#timepicker').datepicker({
        dateFormat: "yy-mm-dd",
        timeFormat: "HH:mm:ss"

    });
    $('#timepicker1').datepicker({
        dateFormat: "yy-mm-dd",
        timeFormat: "HH:mm:ss"

    });
   
  
  });

</script>
<?php $data= $this->arrParams;?>

<?php echo $this->search_form;?>
<?php 
	
	if(!isset($data['ProductID'])) 
	    $data['ProductID']=0; 
	if(!isset($data['time_search']))
		$data['time_search']=5;
	
?>
<div id="container" style="float:left;min-width: 100%; height: 400px; margin: 0 auto"></div>
<script type="text/javascript">
	var chart;
	var start = $("#timepicker1").val();
	var end   = $("#timepicker").val();
	var main_link = '/admin/user/compare-game-chart/';
	link = main_link+'ProductID/'+<?php echo $data['ProductID'];?>;
	link = link+'/time_search/'+<?php echo $data['time_search'];?>;

	if($.trim(start)!= ''){
		link = link+'/Starttime/'+start;
	}
	if($.trim(end)!=''){
   		link = link+'/Endtime/'+end;
	}

    $(document).ready(function(){
       
        $.getJSON(link, function(data) {
        
        chart = new Highcharts.Chart({
            chart: {
                renderTo: 'container',
                plotBackgroundColor: null,
                plotBorderWidth: null,
                plotShadow: false
            },
            title: {
                text: 'Biểu đồ so sánh tăng trưởng user theo game'
            },
            tooltip: {
             pointFormat: '{series.name}: <b>{point.y}</b> Chiếm: <b>{point.percentage:.1f}%</b>'
            },
            plotOptions: {
                pie: {
                    allowPointSelect: true,
                    cursor: 'pointer',
                    dataLabels: {
                        enabled: true,
                           formatter: function() {
                            return '<b>'+ this.point.name +'</b> :<b>'+this.point.y+'-</b> '+ this.percentage.toFixed(2) +' %';
                        }
                        },
                    showInLegend: true
                  
                }
            },
            series: [{
                type: 'pie',
                name: 'Tỉ lệ game',
                data: data
            }]
        });
        });
    });
</script>
<div id="user" style="height: 600px; width: 90%;float: right;padding-right: 2%;"></div>
<div style="clear: both;"></div>
